<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%response.setHeader("cache-control","public"); %>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html>
<html>
<!-- 创建考试第一步 -->
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="renderer" content="webkit">
<title>在线考试系统</title>
<link rel="stylesheet" type="text/css" href="<%=path%>/static/css/common.css">
<link rel="stylesheet" type="text/css" href="<%=path%>/static/css/style.default.css">
<link rel="stylesheet" type="text/css" href="<%=path%>/static/css/bootstrap-table.css">
<link rel="stylesheet" type="text/css" href="<%=path%>/static/css/examMng/paperMng.css">
<!--bootstrap基础引用 start-->
<script type="text/javascript" src="<%=path%>/static/jstreeview/bootstrap/jquery-3.1.1.min.js"></script>
<link rel="stylesheet" href="<%=path%>/static/jstreeview/bootstrap/bootstrap.min.css">
<script type="text/javascript" src="<%=path%>/static/jstreeview/bootstrap/bootstrap.min.js"></script>
<!--bootstrap基础引用 end-->
<!--bootstrap-dialog start-->
<link rel="stylesheet" type="text/css" href="<%=path%>/static/jstreeview/plugins/bootstrap-dialog/bootstrap-dialog.min.css">
<script type="text/javascript" src="<%=path%>/static/jstreeview/plugins/bootstrap-dialog/bootstrap-dialog.min.js"></script>
<!--bootstrap-dialog end-->
<!--bootstrap-treeview start-->
<link rel="stylesheet" type="text/css" href="<%=path%>/static/jstreeview/plugins/bootstrap-treeview/bootstrap-treeview.min.css">
<script type="text/javascript" src="<%=path%>/static/jstreeview/plugins/bootstrap-treeview/bootstrap-treeview.js"></script>
<!--bootstrap-treeview end-->

<script type="text/javascript"
	src="<%=path%>/static/jstreeview/javascripts/customPlugin.js"></script>
<style type="text/css">
.col-md-8 {
	width: 60.66666667% !important;
}

</style>
</head>
<body>
	 <jsp:include page="../head.jsp" flush="true"/>
		<!--body begin-->
		<div class="main-container">
			<div class="container body-box" style="padding: 0px;">
				<div class="title-top" style="background: #4c4ca6;">
					<p>考试大类：</p>
				</div>
				<div class="paper-content">
					<header class="container" style="margin-bottom: 35px;">
						<div class="row">
							<div class="col-md-12" >
								<input id="btnAdd" class="btn btn-primary" type="button"
									value="添加" style="background: #4c4ca6;">
									<input id="btnDel" class="btn btn-danger" type="button" value="删除">
							</div>
						</div>
					</header>
					<div class="container">
						<div class="row">
							<div class="col-md-4">
								<div class="panel panel-primary ">
									<div class="panel-heading" style="background: #4c4ca6;"	>
										<h3 class="panel-title">展示区</h3>
									</div>
									<div class="panel-body right_centent">
										<div id="left-tree"></div>
									</div>
								</div>
							</div>
							<div class="col-md-8">
								<div class="panel panel-primary ">
									<div class="panel-heading" style="background: #4c4ca6;">
										<h3 class="panel-title">编辑区</h3>
									</div>
									<!--编辑操作权限 start-->
									<div class="panel-body right_centent">
										<div id="editShow">
											<div>
												<div class="input-group margin-t-5">
													<span class="input-group-addon">名称:</span>
													<input id="editName" type="text" class="form-control" maxlength="30" />
													<span class="input-group-addon">代码:</span>
													<input id="editCode" type="text" class="form-control" maxlength="30" />
												</div>
											</div>
											<div style="margin-top: 10px;">
												<input id="Edit" class="btn btn-primary" type="button" value="确定" style="background: #4c4ca6;" />
												<input id="Edit_cancel" class="btn btn-default" type="button"
													style="margin-left:80px;display:none;" value="取消" />
											</div>
										</div>
									</div>
									<!--编辑操作权限 end-->
								</div>
							</div>
						</div>
					</div>
					<div>
						<!--弹出框 新增权限 start-->
						<div class="modal fade" id="addOperation-dialog" tabindex="-1"
							role="dialog" aria-labelledby="myModalLabel">
							<div class="modal-dialog" role="document">
								<div class="modal-content radius_5">
									<div class="modal-header">
										<button type="button" class="close" data-dismiss="modal"
											aria-label="Close">
											<span aria-hidden="true">&times;</span>
										</button>
										<h4 class="modal-title" id="myModalLabel">新增</h4>
									</div>
									<div class="modal-body">
										<div group="" item="add">
											<div>
												<div class="input-group margin-t-5">
													<span class="input-group-addon">名称:</span>
													<input id="addName" type="text" class="form-control" maxlength="30" />
													<span class="input-group-addon">代码:</span>
													<input id="addCode" type="text" class="form-control" maxlength="30" />
												</div>
											</div>
										</div>

									</div>
									<div class="modal-footer">
										<button id="Save" type="button" class="btn btn-primary" style="background: #4c4ca6;border-color: #4c4ca6">保存</button>
										<button type="button" class="btn btn-default"
											data-dismiss="modal">取消</button>

									</div>
								</div>
							</div>
						</div>
						<!--弹出框 新增权限 end-->
					</div>
				</div>
			</div>
		</div>
	</div>
</body>
<script type="text/javascript">
	$(function(){
		//大类管理
		if (${role eq 'master'}) {
			$('#topMain').children().eq(0).addClass('active'); // 追加样式;
			$('#topMain').children().eq(0).children().attr('href', '#');
		} else if (${role eq 'trainee'}) {
			$('#topMain').children().eq(0).addClass('active'); // 追加样式;
			$('#topMain').children().eq(0).children().attr('href', '#');
		} else {
			$('#topMain').children().eq(2).addClass('active'); // 追加样式;
			$('#topMain').children().eq(2).children().attr('href', '#');
		}
	})
	$(function() {
		$.ajax({
			url : '<%=path%>/type/dataList/',
			dataType : "json",
			success : function(data) {
				$('#left-tree').treeview({
					data : data,
					levels : 1,
					onNodeSelected : function(event, node) {
						$('#editName').val(node.text);
						$('#editCode').val(node.code);
					},
					showCheckbox : false //是否显示多选
				});
			},
			error : function(XMLHttpRequest, textStatus, errorThrown) {
				alert("error");
			}
		});

		//保存-新增
		$("#Save").click(function() {
			var parentNode = $('#left-tree').treeview('getSelected');
            var id = "";
            var type = "";
            if (parentNode.length != 0) {
                type = parentNode[0].type;
				id = parentNode[0].id;
            }
			var text = $("#addName").val();
            var code = $("#addCode").val();
			if(text.length==0 || (text.replace(/(^\s*)|(\s*$)/g, ""))==0 || text == ""){
                $.showMsgText("名称不能为空");
				return
			}
            text = text.replace(/(^\s*)|(\s*$)/g, "");
			$.ajax({
				url : '<%=basePath%>type/save',
				data : {
				    tempid: id,
					name : text,
					type : type,
                    code : code
				},
				dataType : "json",
				success : function(data, status) {
					$('#addOperation-dialog').modal('hide')
					if (data[0].status==0) {
						$.showMsgText(data[0].msg);
					} else {
						//静态添加节点
						var parentNodeAdd = $('#left-tree').treeview('getSelected');
						var node = {
							text: $('#addName').val(),
							id: data[0].obj.id,
							type: data[0].obj.extend,
							code: data[0].obj.code
						};
						$('#left-tree').treeview('addNode', [node, parentNodeAdd]);
					}
				},
				error : function(XMLHttpRequest, textStatus, errorThrown) {
					alert("error");
				}
			});
		});

		//保存-编辑
		$('#Edit').click(function() {
			var pnode = $('#left-tree').treeview('getSelected');
			var newNode={
				text:$('#editName').val(),
				code:$('#editCode').val()
			};
			var id = pnode[0].id;
			var type = pnode[0].type;
			var name = $("#editName").val();
			var code = $("#editCode").val();
			if(name.length==0 || (name.replace(/(^\s*)|(\s*$)/g, ""))==0 || name == ""){
				$.showMsgText("名称不能为空");
				return
			}
			name = name.replace(/(^\s*)|(\s*$)/g, "");
			$.ajax({
				url : '<%=basePath%>type/update',
				data : {
					id : id,
					name : name,
					code : code,
					type : type
				},
				dataType : "json",
				success : function(data, status) {
					console.info(data);
					if (data[0].status==0) {
						$.showMsgText(data[0].msg);
					} else {
						$('#left-tree').treeview('updateNode', [ pnode, newNode]);
					}
				},
				error : function(XMLHttpRequest, textStatus, errorThrown) {
					alert("error");
				}
			});
		});
		//显示-添加
		$("#btnAdd").click(function() {
			var node = $('#left-tree').treeview('getSelected');
            $('#addName').val('');
			$('#addCode').val('');
            if (node.length != 0) {
                var typeview = node[0].type;
				var idview = node[0].id;
                if (typeview=="rank" && idview!==null && idview!=="") {
                    $.showMsgText("级别下不允许有子元素");
                    return
                }
            }
			$('#addOperation-dialog').modal('show');
		});

		//显示-编辑
		$("#btnEdit").click(function() {
			var node = $('#left-tree').treeview('getSelected');
			$('#editShow').show();

		});
		//删除
		$("#btnDel").click(function() {
			var node = $('#left-tree').treeview('getSelected');
			if (node.length == 0) {
				$.showMsgText('请选择节点');
				return;
			}
			BootstrapDialog.confirm({
				title : '提示',
				message : '确定删除此节点?',
				size : BootstrapDialog.SIZE_SMALL,
				type : BootstrapDialog.TYPE_DEFAULT,
				closable : true,
				btnCancelLabel : '取消',
				btnOKLabel : '确定',
				callback : function(result) {
					if(result){
					var pnode = $('#left-tree').treeview('getSelected');
					$.ajax({
						url : '<%=path%>/type/del',
						data : {
							type : pnode[0].type,
							id : pnode[0].id,
							name : pnode[0].text
						},
						dataType : "json",
						success : function(data, status) {
							$("#editName").val('');
							$("#editCode").val('');
							if (status == "success") {
								$('#left-tree').treeview('removeNode', [ node, { silent: true } ]);
							}
						},
						error : function(XMLHttpRequest, textStatus, errorThrown) {
							alert("error");
						}
					});
					}
				}
			});
		});
		$("#btnMove").click(function() {
			$.showMsgText('更新中...');
		});

		/*-----页面pannel内容区高度自适应 start-----*/
		$(window).resize(function() {
			setCenterHeight();
		});
		setCenterHeight();
		function setCenterHeight() {
			var height = $(window).height();
			var centerHight = height - 240;
			$(".right_centent").height(centerHight).css("overflow", "auto");
		}
	/*-----页面pannel内容区高度自适应 end-----*/
	});
</script>

</html>